<!DOCTYPE html>
<style>
div {
  display: inline-block;
  text-align: center;
  width: 150px;
  margin: 30px 0;
}
span {
  outline: 30px solid green;
  outline-offset: -30px;
  border-radius: 10px;
  font-size: 40px;
  font-family: ahem;
  color: yellow;
}
</style>
<div><span>A<br>ABC<br>AB</span></div>
<div><span style="outline-style: double">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: dashed">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: dotted">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: groove">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: ridge">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: inset">A<br>ABC<br>AB</span></div>
<div><span style="outline-style: outset">A<br>ABC<br>AB</span></div>
